<template>
	<view class="shoppingtrolley">
		<view class="shoppingtrolley_box">
			<view class="kong">

			</view>
			<view class="shoppingtrolley_box_tou">
				<u-icon class="u-icon-1" name="arrow-left" @click="goback" color="#FFFFFF" size="28"></u-icon>
				<view class="gouwu">
					购物车
				</view>
				<u-icon class="u-icon-2" name="trash" @click="shopdelete" color="#FFFFFF" size="28"></u-icon>
			</view>
			<view class="shoppingtrolley_box_dibu">

			</view>
			<view class="shoppingtrolley_box_top">

				<view v-if="isshow" style="text-align: center;">
					<image src="../../static/iconShow/noOrder.png"></image>
				</view>
				<u-swipe-action style="padding-bottom: 60px;">
					<u-swipe-action-item :options="options1" v-for="(item,index) in shoppinglist" :key="item.id"
						@click="itemDelClick(item.id)">
						<view class="swipe-action u-border-top u-border-bottom">
							<view class="swipe-action__content">
								<view class="choice">

									<checkbox-group @change="onChange($event,item.id)">
										<checkbox :checked="item.flag" style="transform:scale(0.8)" color="#FF8F1F" />
									</checkbox-group>
								</view>
								<view class="left">
									<view class="left_img">
										<image :src="item.productInfo.image"></image>
									</view>
									<view class="left_right">
										<view class="jishi">{{item.productInfo.storeName}}</view>
										<view class="left_right_tinajia">
											<text class="text">{{item.productInfo.storeInfo}}</text>
											<view class="xia_right">

												<u-icon name="minus" size="14" color="#fff" @click="jian(item)" />

												<text class="text6">{{item.cartNum}}</text>

												<u-icon name="plus" size="14" color="#fff" @click="add(item)" />

											</view>
										</view>
										<view class="qian">
											<text class="text1">￥</text>
											<text class="text2">{{item.truePrice}}</text>
											<text class="text1"></text>
										</view>
									</view>

								</view>
							</view>
						</view>
					</u-swipe-action-item>
				</u-swipe-action>
			</view>
			<view class="shoppingtrolley_bottom">
				<view class="left">

					<checkbox-group @change="checkall">
						<checkbox :checked="allchecked" style="transform:scale(0.8)" color="#FF8F1F" />
					</checkbox-group>
					<text class="text">全选</text>
				</view>
				<view class="right">
					<view class="heji">
						<text class="text">合计</text>
						<view class="qian">
							<text class="text1">￥</text>
							<text class="text2">{{totalPrice}}.</text>
							<text class="text1">0</text>
						</view>
					</view>
					<view class="jiesuan" @click="placeanorder">立即下单</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import homeServices from '../../service/homeService'
	export default {
		data() {
			return {
				num: 1,
				checked: true,
				allchecked: false,
				shoppinglist: [],
				checkedIds: [],
				totalPrice: 0,
				number: 0,
				shanchu: false,
				options1: [{
					text: '删除',
					style: {
						backgroundColor: '#FF8F1F'
					}
				}],
				dellist: [],
				isshow: false

			}
		},
		methods: {
			goback() {
				uni.navigateBack()
			},
			async shopdelete() {
				this.shoppinglist.map(it => {
					if (it.flag == true) {
						this.dellist.push(it.id)

					}
					this.dellist = [...new Set(this.dellist)];
				})
				
				if(this.dellist == ''){
					uni.showToast({
						title: '暂无可删除的商品',
						icon: 'none'
					})
					return
				}
				let params = {
					ids: this.dellist,

				}
				let res = await homeServices.itemDelClick(params)
				this.dellist = []
				this.getshoppingtrolley()
				setTimeout(() => {
					this.setCart()
				}, 800)

			},
			// 单选
			onChange(e, id) {
				var temp = []
				// 找到被修改的商品对象
				let index = this.shoppinglist.findIndex(v => v.id === id)


				console.log(index, 'bbbbbbbbbbbbb')
				// 选中状态取反
				this.shoppinglist[index].flag = !this.shoppinglist[index].flag
				temp = this.shoppinglist.every(v => v.flag)
				console.log(temp)
				if (temp) {
					this.allchecked = true
				} else {
					this.allchecked = false
				}

				this.setCart()

			},
			// 全选
			checkall() {

				this.allchecked = !this.allchecked
				this.shoppinglist.forEach(v => v.flag = this.allchecked)
				this.setCart()

			},
			setCart() {
				let totalPrice = 0
				let checkedIds = []
				this.checkedIds = []
				console.log(this.shoppinglist);
				this.shoppinglist.forEach(v => {
					if (v.flag) {
						totalPrice += v.cartNum * v.truePrice

						this.checkedIds.push(v)
						console.log(this.checkedIds);
					}
				})
				this.totalPrice = totalPrice
				console.log(this.totalPrice);
			},

			async getshoppingtrolley() {

				let res = await homeServices.getshoppingtrolley()
				this.shoppinglist = res.data.valid
				this.shoppinglist.map(item => {
					item.flag = false

				})
				if (this.shoppinglist.length == 0) {
					this.isshow = true
					this.allchecked = false
				} else {
					this.isshow = false
				}
				console.log(this.shoppinglist, 'nnnnnnnnnnnn')
			},
			async jian(item) {

				let id = item.id
				if (item.cartNum > 1) {
					item.cartNum--
					this.number = item.cartNum
				}


				let params = {
					id: id,
					number: this.number
				}
				let res = await homeServices.cartnum(params)
				console.log(res, 'xxxxxxxxxxx')
				this.setCart()
			},
			async add(item) {

				let id = item.id
				item.cartNum++
				this.number = item.cartNum

				let params = {
					id: id,
					number: this.number
				}
				let res = await homeServices.cartnum(params)
				this.setCart()
			},




			async itemDelClick(id) {
				console.log('要删除的数据项的id：', id);

				let arr = []
				arr.push(id)
				let params = {
					ids: arr,

				}
				let res = await homeServices.itemDelClick(params)
				arr = []
				this.getshoppingtrolley()

				setTimeout(() => {
					this.setCart()
				}, 800)


			},

			// 下单
			placeanorder() {
				let id = []
				this.shoppinglist.forEach(item => {
					if (item.flag === true) {
						id.push(item.id)
						console.log(id, 'ssssssssss')
					}
				})

				let ids = id.join(',')
				if (ids == '') {
					uni.showToast({
						title: '请先去添加商品',
						icon: 'none'
					})
					return;
				}
				uni.setStorageSync('cartId', ids)
				uni.navigateTo({
					url: '../purchase/purchase?cartIds=' + ids
				})
			}
		},

		onLoad() {
			this.getshoppingtrolley()
			// this.test.checked = false
			this.setCart()
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/static/sass/shoppingtrolley.scss'
</style>
